import React, { useRef, FC } from 'react'

const TdInput: FC = ({}) => {

const inputRef = useRef<HTMLInputElement>(null);

  
  return (
    <div className="flex w-full max-w-sm mx-auto space-x-3">
      <input ref={inputRef} type="text" className="flex-1 appearance-none border border-transparent w-full py-2 px-4 bg-white text-gray-700 placeholder-gray-400 shadow-md rounded-lg text-base focus:outline-none focus:ring-2 focus:ring-purple-600 focus:border-transparent" placeholder="Your content" />
      <button className="flex-shrink-0 bg-purple-600 text-white text-base font-semibold py-2 px-4 rounded-lg shadow-md hover:bg-purple-700 focus:outline-none focus:ring-2 focus:ring-purple-500 focus:ring-offset-2 focus:ring-offset-purple-200">
        添加
    </button>
    </div>
  )
}

export default TdInput